<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>Instituto Missionário de Ensino El Shaday</title>
    <link rel="stylesheet" href="css/gemepde.css"  />
</h:head>
<h:body style="font-size: 14px;">
<p:growl id="messages" showDetail="true"/>
	<div id="geral">
		<h:form id="formCadastro">
			
			<p:panel header="Cadastro de Aluno" style="margin:5px; width: auto;">
				<p:panelGrid>
					<p:row>
						<p:column colspan="7">
							<div align="center" id="divModulos">
								<p:panel header="Modulos">

									<h:form id="formAdicionarModulo">
										<div align="right">
											<p:commandButton id="btn-adicionar" action="#{alunoBean.novoModulo}" value="Adicionar"
												icon="ui-icon-plus" oncomplete="dialogAdicionarModulo.show()" update="@([id$=adicionarModuloDialog])"/>
										</div>
									</h:form>
									<h:form id="formModuloResultado">
										<p:dataTable id="tabelaModulos"
											value="#{alunoBean.listaModulos}" var="modulo">
											<p:column headerText="Modulo">
												<h:outputText value="#{modulo.modulo}" style="color: #{modulo.cor}; font-weight: bold;"/>
											</p:column>

											<p:column headerText="Media" width="10%">
												<div align="center">
													<h:outputText id="modulo-media" value="#{modulo.media}" style="color: #{modulo.cor}; font-weight: bold;"/>
												</div>
											</p:column>

											<p:column headerText="Recebido" width="10%">
												<div align="center">
													<p:selectBooleanButton value="#{modulo.recebido}" onLabel="Sim" offLabel="Não" disabled="true" style="opacity: 1; border: none; color: #{modulo.cor};"/>
												</div>
											</p:column>

											<p:column headerText="Pago" width="10%">
												<div align="center">
													<p:selectBooleanButton value="#{modulo.pago}" onLabel="Sim" offLabel="Não" disabled="true" style="opacity: 1; border: none; color: #{modulo.cor};"/>
												</div>
											</p:column>

											<p:column headerText="Editar" width="10%">
												<div align="center">
													<p:commandButton id="btn-editar" icon="ui-icon-pencil"
														action="#{alunoBean.editarModulo()}" />
												</div>
											</p:column>

											<p:column headerText="Excluir" width="10%">
												<div align="center">
													<p:commandButton id="btn-excluir" icon="ui-icon-trash"
														action="#{alunoBean.removerModulo()}" />
												</div>
											</p:column>
										</p:dataTable>
									</h:form>
								</p:panel>
							</div>
						</p:column>
					</p:row>

			   	</p:panelGrid>
			   	
				<f:facet name="footer">  
					<h:outputLabel style="padding-left: 600px;"/>
					<p:commandButton id="btn-cancelar" action="#{alunoBean.cancelarCadastro()}" value="Cancelar" icon="ui-icon-closethick" style="margin:0"/>
					<h:outputLabel style="padding-left: 100px;"/>
					<p:commandButton id="btn-reset" type="reset" value="Limpar" icon="ui-icon-minusthick" style="margin:0"/>
					<h:outputLabel style="padding-left: 100px;"/>
			        <p:commandButton id="btn-salvar" action="#{alunoBean.salvarAluno()}" value="#{alunoBean.tipoBotaoCadastro}" icon="ui-icon-disk" style="margin:0" />
			    </f:facet>
			   	
			</p:panel>
		</h:form>
	</div>	

<!-- 	ADICIONAR MODULO -->
<p:dialog header="Adicionar Módulo" widgetVar="dialogAdicionarModulo" modal="true" 
	draggable="false" resizable="false" width="auto" id="adicionarModuloDialog">
	<div align="center">
		<h:form id="formModulo">
			<p:panelGrid>
				<p:row>
					<p:column><h:outputLabel for="nome-modulo" value="Módulo: " /></p:column>
					<p:column colspan="3"><p:inputText id="nome-modulo" size="60" value="#{alunoBean.modulo.modulo}" required="true" requiredMessage="Campo módulo é obrigatório"/></p:column>
				</p:row>
				<p:row>
					<p:column><h:outputLabel for="media-modulo" value="Media: " /></p:column>
					<p:column><p:inputText id="media-modulo" size="30" value="#{alunoBean.modulo.media}"/></p:column>
					<p:column>
						<h:outputLabel for="cor-modulo" value="Cor:" />
					</p:column>
					<p:column>
						<p:selectOneMenu id="cor-modulo" value="#{alunoBean.cor}">
							<f:selectItem itemLabel="Preto" itemValue="black" />  
           					<f:selectItem itemLabel="Vermelho" itemValue="red" />
						</p:selectOneMenu>
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<h:outputText value="Recebido: " />
					</p:column>
					<p:column colspan="3">
						<p:selectBooleanButton value="#{alunoBean.modulo.recebido}" onLabel="Sim" offLabel="Não" onIcon="ui-icon-check" offIcon="ui-icon-close"/>
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<h:outputText value="Pago: " />
					</p:column>
					<p:column colspan="3">
						<p:selectBooleanButton value="#{alunoBean.modulo.pago}" onLabel="Sim" offLabel="Não" onIcon="ui-icon-check" offIcon="ui-icon-close"/>
					</p:column>
				</p:row>
				<p:row>
					<p:column colspan="3">
						<div align="right">
							<p:commandButton value="Cancelar" style="width: 120px;"  onclick="dialogAdicionarModulo.hide()"/>
						</div>
					</p:column>
					<p:column>
							<p:commandButton value="Adicionar" style="width: 120px;" action="#{alunoBean.adicionarModulo}" oncomplete="dialogAdicionarModulo.hide();" update="@([id$=tabelaModulos])"/>
					</p:column>
				</p:row>
			</p:panelGrid>
		</h:form>
	</div>
</p:dialog>

	
</h:body>
</html>